<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>登入页面</title>
		<link rel="stylesheet" type="text/css" href="/Public/bootstrap/css/bootstrap.min.css"/>
		<link rel="stylesheet" type="text/css" href="/Public/css/jquery.idcode.css"/>
	<style>
		body {
			font-family:"Hiragino Sans GB","Microsoft YaHei","WenQuanYi Micro Hei",sans-serif;
		}
		.bg {
			background: #F5F5F5;
		}
		.line {
			border: 1px solid red;
		}
		.head {
			margin-top: 130px;
		}
		.main {
			background: #FFFFFF;
			display: flex;
			justify-content: center;
			align-content: center;
			flex-direction: column;
			padding: 30px;
		}
		.main_head {
			line-height: 50px;
			text-align: center;
			padding-bottom: 30px;
			border-bottom:1px solid #e6e6e6
		}
		.main_form {
			padding-top: 40px;
			padding-bottom: 50px;
		}
		.help-block {
			color: #d9534f;
		}
		.trig {
			margin-top: 10px;
		}
		#Txtidcode {
			width: 120px;
			border: 1px solid #ccc;
		}
		.modal-dialog {
			width: 300px;
		}
		.modal-footer {
			border-top: 0;
		}
@media only screen and (min-width:768px ) {
	.modal-dialog {
		margin: 150px auto;
	}
}		
.register {
	background-color: #f70;
	color:#fff;
}
.register:hover {
	color:#fff;
	background-color: #e46d04;
}
	</style>
	</head>
	<body class="bg">
		
		<div class="container head">
			<div class="row">
				<div class="col-md-10 col-md-offset-1">
					<div class="main">
						<div class="row">
							<div class="col-md-12 main_head">
								<img class="center-block" src="/Public/static/Index/Images/logo1.png" width="17%"/>
								<h4 style="font-weight: bold;font-size: 20px;">登入杰匠平台账号</h4>
							</div>
						</div>
						<div class="row">
							<div class="col-md-4 col-md-offset-4">
								<div class="main_form">
									<form method="post" id="register">
									<div class="form-group">
									<input class="form-control" type="number" name="moblie" id="moblie" placeholder="手机号码" />										
									
									</div>
									
									<div class="form-group">
									<input class="form-control" type="password" name="password" id="user_password" placeholder="密码" />										
									<!--<span class="help-block">登录密码不能少于 6 个字符</span>-->
									</div>								
									
									<div class="form-group">
										<input type="text" name="code" id="Txtidcode" class="txtVerification" />
										<span id="idcode"></span>
									</div>

									<div class="form-group pull-right">
										<a href="{:U('index/login/forgetPwd')}" class="">忘记密码</a>
									</div>
										<p class="top15 captcha" id="captcha-container">  
  <input name="verify" width="50%" height="50" class="captcha-text" placeholder="验证码" type="text">                  
  <img width="30%" class="left15" height="50" alt="验证码" src="{:U('index/login/verify_c')}" title="点击刷新">  
</p>  
									<!--<button class="btn btn-block btn-success btn-16">注册</button>-->
									<input type="submit" id="btns" class="btn btn-block btn-success btn-16" value="立即登入"/>
								</form>
									<a href="{:U('index/login/register')}" class="btn btn-block register btn-16" style="margin-top: 10px;text-decoration: none;height: 33px">注册帐号
									</a>
								</div>
								
							</div>
						</div>
						
					</div>
				</div>
			</div>
			
			<div class="modal fade bs-example-modal-sm" id="myModal_error" tabindex="-1">
			  <div class="modal-dialog">
			    <div class="modal-content">
			      <div class="modal-body">
			      	  <h4 id="tips" class="text-center">对不起，您输入的验证码不正确</h4>
			      </div>
			      <div class="modal-footer">
			        <button type="button" class="btn btn-danger btn-block" data-dismiss="modal">确认</button>
			      </div>
			    </div>
			  </div>
			</div>
			
		</div>
		
		
		<script type="text/javascript" src="/Public/js/jquery-1.10.2.min.js"></script>
		<script type="text/javascript" src="/Public/bootstrap/js/bootstrap.min.js" ></script>
		<script type="text/javascript" src="/Public/js/jquery.validate.min.js"></script>
		<script type="text/javascript" src="/Public/js/jquery.idcode.js" ></script>
		<script type="text/javascript">
			$(function(){
			
				$.idcode.setCode();
				$("#btns").click(function() {
				    var IsBy = $.idcode.validateCode();
				    if(!IsBy) {
				    	$('#myModal_error').modal('show');
				    	return false;
				    }
				    return
				});
				
				var settings = {
				    e: 'idcode',
				    codeType: {
				        name: 'follow',
				        len: 4
				    },
				    codeTip: 'refresh?',
				    inputID: 'Txtidcode' //这个就是你页面输入验证码的文本框ID 
				};
				
				var IsBy = $.idcode.validateCode();
					
				})
		</script>
	</body>
</html>